<div class="order_pannel">
    <h2 class="mag-tit">推荐返利</h2>
    <ul id="my-back">
    	<li class="my-mag-tit" >
        	<span class="cash-back">
            	返利总额：<s th:remove="tag" blc:fsprice="${addedTotal.add(confirmedTotal)}"></s>    
        	</span>
        	<span class="cash-back">
            	可提取金额：<s th:remove="tag" blc:fsprice="${confirmedTotal}"></s>    
        	</span>
        	<span class="cash-back">
            	未确认金额：<s th:remove="tag" blc:fsprice="${pendingTotal}"></s>  
        	</span>
    	</li>
    </ul>
    <ul id="order-history"  th:unless="${#lists.isEmpty(referralOrderItems)}">
        <li class="order-tit" th:unless="${isMobile}">
            <span class="order-des">商品</span>
            <span class="total">金额</span>
            <span class="total">数量</span>
            <span class="total">返利</span>
            <span class="status">状态</span>
            <span class="submit-date">更新日期</span>
        </li>
        <li class="order" th:each="referralOrderItem : ${referralOrderItems}" th:object="${referralOrderItem}">
            <span class="order-des">
                <a th:href="@{*{orderItem.product.url}}" target="_blank">
                    <img th:if="*{orderItem.product.media['primary'] != null}"
                        th:src="@{*{orderItem.product.media['primary'].url} + '?thumbnail'}" width="60" th:alt="*{orderItem.product.name}" />
                </a>
                <span th:text="*{orderItem.product.name}"></span>
            </span>
            <span class="total">
            	<b th:if="${isMobile}">金额：</b>
         	    <s blc:fsprice="*{orderItem.getDisplayedTotalPrice()}"></s>
            </span>
            <span class="total">
            	<b th:if="${isMobile}">数量：</b>
                <s th:text="*{orderItem.quantity}"></s>
            </span>
            <span class="total">
          		<b th:if="${isMobile}">返利：</b>
                <s blc:fsprice="*{referralCredit}"></s>
            </span>
            <span class="status">
            	<b th:if="${isMobile}">状态：</b>
                <s class="status" th:text="*{referralStatus.friendlyName}"></s>
            </span>
            <span class="submit-date">
            	<b th:if="${isMobile}">更新日期：</b>
                <s th:text="*{#dates.format(orderItem.order.auditable.dateUpdated, 'yyyy-MM-dd')}"></s>
            </span>
        </li>
    </ul>
    <h3 th:if="${#lists.isEmpty(referralOrderItems)}">您还未推荐过任何商品。</h3>
</div>